/* pages/setting/setting.wxss */
.p-setting {
    .top {
        font-size: 28rpx;
        margin:  0 0 20rpx;
        padding: 14rpx 6% 0;
        background-color: #fff;

        .group {
            padding: 20rpx 0 0;
            border-bottom: 1px solid #efefef;
        }

        .title {
            color: #666;
            line-height: 2.9;
        }

        .goods {
            display: flex;
            padding-bottom: 10rpx;
            flex-wrap: wrap;
            .menu {
                width: 31.25%;
                line-height: 2.8;
                font-size: 32rpx;
                text-align: center;
                display: block;
                border: 1px solid #007bf6;
                border-radius: 15rpx;
                margin-bottom: 30rpx;
                &.active {
                    color: #fff;
                    background: #007bf6;
                }
                &:nth-of-type(3n-1){
                    margin: 0 3.125% 30rpx;
                }
            }
        }

        .address {
            line-height: 1.3;
            display: flex;
            padding-bottom: 18rpx;
            align-items: center;

            .name {
                width: 90%;
            }

            .icon {
                width: 10%;
                text-align: right;

                image {
                    width: 28rpx;
                    height: 35rpx;
                }
            }
        }

    }

    .price-wrap {
        padding-bottom: 15rpx;
        text-align: center;
        background-color: #fff;
        .price-title {
            line-height: 4;
            color: #007bf6;
            display: flex;
            justify-content: center;
            align-items: center;

            image {
                width: 40rpx;
                height: 40rpx;
                margin-right: 15rpx;
            }
        }

        .price-group {
            .group-title {
                width: 30%;
                height: 40rpx;
                color: #888;
                margin: 40rpx auto 50rpx;
                font-size: 30rpx;
                border-top: 1px solid #ddd;
                position: relative;
                text {
                    width: 100rpx;
                    background: #fff;
                    position: absolute;
                    top: -20rpx;
                    left: 50%;
                    transform: translateX(-50%);
                    -webkit-transform: translateX(-50%);
                }
            }

            .oils {
                padding: 0 5%;
                color: #999;
                font-size: 26rpx;
                display: flex;
                flex-wrap: wrap;
                .oil{
                    width: 29%;
                    padding: 50rpx 0 12rpx;
                    border: 1px solid #007bf6;
                    border-radius: 14rpx;
                    position: relative;
                    margin-bottom: 80rpx;
                    .oil-type{
                        width: 80rpx;
                        height: 80rpx;
                        font-size: 30rpx;
                        line-height: 80rpx;
                        display: inline-block;
                        background: #007bf6;
                        color: #fff;
                        border-radius: 50%;
                        position: absolute;
                        top: -40rpx;
                        left: 50%;
                        transform: translateX(-50%);
                        -webkit-transform: translateX(-50%);
                    }
                    .oil-name{
                        line-height: 1.8;
                    }
                    .oil-price{
                        text{
                            color: #007bf6;
                            font-size: 36rpx;
                        }
                    }
                    &:nth-of-type(3n-1){
                        margin: 0 6.5% 80rpx;
                    }
                    
                }
            }
        }
    }
}